<template>
    <div>
        <!--新增按钮位置-->
        <div style="position:fixed;z-index:100;width:100%">
            <div role="button" tabindex="0" @click="addOne"
                class="van-cell van-cell--clickable van-cell--center van-cell--borderless van-contact-card van-contact-card--add"
                style="position:fixed;width:50%;">
                <div class="van-cell__value van-cell__value--alone van-contact-card__value">写日报</div><i
                    class="van-icon van-icon-arrow van-cell__right-icon">
                </i>
            </div>
            <div style="position:fixed;width:50%;left:50%;padding: 2px;" class="van-cell--borderless van-contact-card">
                <van-dropdown-menu title="班级选择">
                    <van-dropdown-item v-model="classId" :options="classInfos" @change="changeClass" />
                </van-dropdown-menu>
            </div>
        </div>
        <div v-show="show == 0">
            <div style="height: 80px"></div>
            <div class="van-cell-group van-cell-group--inset van-hairline--top-bottom">
                <div style="text-align: left"
                    v-for="(item, index) in dailys"
                    role="button" tabindex="0" class="van-cell van-cell--clickable">
                    <div class="van-cell__title"><span>工作概述：{{item.content}}</span>
                        <div class="van-cell__label">创建问题：{{item.problem}}</div>
                        <div v-show="item.comment != null" class="van-cell__label">教师回复：{{item.comment}}</div>
                        <div class="van-cell__label">创建时间：{{item.createTime.substring(0,10)}}</div>
                    </div><i class="van-icon van-icon-arrow van-cell__right-icon">
                        <!---->
                    </i>
                </div>
            </div>
            <div style="height: 80px"></div>
        </div>
        <div v-show="show == 1">
            <div style="height: 80px"></div>

            <van-field v-model="content" rows="5" autosize label="工作概述：" type="textarea" maxlength="350"
                placeholder="请输入工作概述" show-word-limit />

            <van-field v-model="problem" rows="5" autosize label="存在的问题：" type="textarea" maxlength="350"
                placeholder="请输入问题" show-word-limit />

            <van-button @click="addDaily" color="#7232dd" type="primary" block>提交日报</van-button>
            <van-button color="linear-gradient(to right, #ff6034, #ee0a24)" type="primary" block @click="back">返回列表
            </van-button>
            <div style="height: 80px"></div>
        </div>
    </div>
</template>
<style>
.van-dropdown-menu__bar {
    height: 67px;
}
</style>
<script>
import req from '../../request/index'
export default {
    name: '',
    data() {
        return {
            show: 0,
            classInfos: [],
            classId: '',
            dailys: [],
            content: '',
            problem: '',
        };
    },
    methods: {
        addDaily(){
            req({
                url: "addDaily",
                method: "post",
                data: {
                    relationStudentId: this.$store.state.user.id,
                    relationClassId: this.classId,
                    content: this.content,
                    problem: this.problem,

                }
            }).then(res => {
                this.back();
            }).catch(err => {
                console.log(err);
            })
        },
        back() {
            this.show = 0;
            this.getDailys();
        },
        addOne() {
            this.show = 1;
            this.content = '';
            this.problem = '';
        },
        getDailys() {
            req({
                url: "getStudentDailys",
                method: "post",
                data: {
                    relationStudentId: this.$store.state.user.id,
                    relationClassId: this.classId
                }
            }).then(res => {
                console.log(res.data.data)
                this.dailys = res.data.data
            }).catch(err => {
                console.log(err);
            })
        },
        getShixun() {
            req({
                url: "getShixun",
                method: "post",
                data: {
                    id: this.$store.state.user.id
                }
            }).then(res => {
                if (res.data.code == 0) {
                    var data = res.data.data;
                    this.classId = res.data.data[0].id;
                    this.practiceTitle = res.data.data[0].practiceTitle;
                    for (var i = 0; i < data.length; i++) {
                        var x = { text: '班级1', value: 0 };
                        x.text = data[i].practiceTitle;
                        x.value = data[i].id;
                        this.classInfos.push(x);
                    }
                    console.log(this.classInfos)
                    this.getDailys();
                }
            }).catch(err => {
                console.log(err);
            })
        },
        changeClass(res) {
            console.log(res)
            //根据班级id获取当前的所有任务信息
            for (var i = 0; i < this.classInfos.length; i++) {
                if (this.classInfos[i].value == res) {
                    this.practiceTitle = this.classInfos[i].text;
                    this.getDailys();
                }
            }
        },
    },
    computed: {
    },
    mounted() {
        this.getShixun();
    },
}
</script>